<!DOCTYPE html>
<html>
<head>
  <title>Bug 1121748-1</title>
  <meta charset=utf-8>
  <style>
    html { width: 25%; }
    ul {
      margin: 0;
      padding: 0;
      border: 1px solid green;
    }
    ul li {
      position: relative;
      margin: 2px 10px;
      background: #eee;
      display: block;
    }
    ul li[hidden] {
      display: none;
    }
  </style>
  <script>
  function test() {
    document.body.dir = 'rtl';
    document.querySelector('#test').offsetHeight;
    document.querySelector('#test').hidden = false;
  }
  </script>
</head>
<body onload="test()">
  <ul>
    <li id="test" hidden> item #1 </li>
    <li> item #2 </li>
    <li> item #3 </li>
  </ul>
</body>
</html>
